<template>
  <basic-container>
    <avue-crud 
      v-bind="bindVal" 
      v-on="onEvent" 
      v-model="form" 
      v-model:page="page"
    >
      <template #category="{ row }">
        <el-tag>{{ row.categoryName }}</el-tag>
      </template>
      <template #file-form="{ type,disabled }">
        <hnyUpload :disabled="disabled" v-model:file-list="fileList" title="点击上传图片" tip="上传图片提示文案" @success="handleSuccess"></hnyUpload>
      </template>
    </avue-crud>
  </basic-container>
</template>

<script>
import postOption from "@/option/system/post"
export default window.$crudCommon(
  {
    data() {
      return {
        option: postOption,
        fileList: [
          {
            name: 'food.jpeg',
            url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100',
          },
        ]
      };
    },
    methods: {
      handleSuccess(response, file, fileList) {
        this.fileList.push({
          name: response.data.originalName,
          url: response.data.link
        })
      },
      //列表前操作方法
      listBefore() {},

      //列表后操作方法
      listAfter() {},

      //新增前操作方法
      addBefore() {
        this.form.file = this.fileList;
      },
      //新增后操作方法
      addAfter() {},

      //修改前操作方法
      updateBefore() {
        // this.form.updateUser = 'small';
      },

      //修改后操作方法
      updateAfter() {},

      //删除前操作方法
      delBefore() {},
      //删除后操作方法
      delAfter() {},
    },
  },
  {
    name: 'system/post', //模块名字
    list: 'getList', //列表接口名字
    update: 'update', //更新接口名字
    add: 'add', //新增接口名字
    del: 'remove', //删除接口名字
    rowKey: 'id', //主键，用于批量删除，获取主键
    pageNumber: 'pageNumber', //页码
    pageSize: 'pageSize', //页数
    res: res => {
      const data = res.data;
      // json字段值转换
      let records = data.records || [];
      data.records = records;
      return data;
    }, //列表的结构，个性化处理
    total: 'total', //总页数
  }
);
</script>
<style lang="scss" scoped></style>
